/*
* layout右键菜单
* */
import {useRef, useEffect, useState} from 'react'
import menuStore from "@/store/menuStore.ts";
const useLayoutRightMenu = () => {
    const tabsRef = useRef(null)
    const [activeTabRightKey, setActiveTabRightKey] = useState('')
    const [activeTabRightIndex, setActiveTabRightIndex] = useState(0)
    const [show, setShow] = useState(false)
    const [position, setPosition] = useState({ x: 0, y: 0 })
    const handleRightClick = (e: MouseEvent) => {
        setShow(false)
        if (tabsRef.current && (tabsRef.current as { contains: (target: EventTarget | null) => void }).contains(e.target)) {
            e.preventDefault()
            const activeKey = (e.target as EventTarget & { id: string }).id.replace('rc-tabs-0-tab-', '')
            if (activeKey) {
                for (let i = 0; i < menuStore.menuTabs.length; i++) {
                    if (menuStore.menuTabs[i].key === activeKey) {
                        setActiveTabRightIndex(i)
                        break
                    }
                }
                setActiveTabRightKey(activeKey)
                setPosition({ x: e.pageX, y: e.pageY })
                setShow(true)
            }
        }
    }
    useEffect(() => {
        document.addEventListener('contextmenu', handleRightClick, false)
        document.addEventListener('mouseup', () => { setShow(false) }, false)
        return () => {
            document.removeEventListener('contextmenu', handleRightClick, false)
            document.removeEventListener('mouseup', () => {}, false)
        }
    }, []);
    return { tabsRef, activeTabRightKey, position, show, activeTabRightIndex }
}
export default useLayoutRightMenu